<%-- 
    Document   : DetectPage
    Created on : Feb 14, 2015, 4:04:40 PM
    Author     : user
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<title>WebRTC: Still photo capture demo</title>
	<meta charset='utf-8'>
	<link rel="stylesheet" href="main.css" type="text/css" media="all">
	<script src="js/capture.js">
	</script>
</head>
<body>
<div class="contentarea">
	<h1>
		MDN - WebRTC: Still photo capture demo
	</h1>
	<p>
		This example demonstrates how to set up a media stream using your built-in webcam, fetch an image from that stream, and create a PNG using that image.
	</p>
	<div class="visuals">
		<div class="camera">
			<video id="video">Video stream not available.</video>
                        <button id="startbutton">Take photo</button> 
		</div>
		<canvas id="canvas">
		</canvas>
		<div class="output">
			<img id="photo" alt="photo"> 
		</div>
	</div>
	<p>
		Visit our article <a href="https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Taking_still_photos"> Taking still photos with WebRTC</a> to learn more about the technologies used here.
	</p>
</div>
</body>
</html>